<template>
	<vk-data-dialog
		v-model="value.show"
		:title="page.title"
		:top="page.top"
		:width="page.width"
		:close-on-click-modal="true"
		center
		@open="onOpen"
		@closed="onClose"
	>
		<view>
			<!-- 页面主体内容开始 -->
			<!-- 表格搜索组件开始 -->
			<vk-data-table-query
				v-model="queryForm1.formData"
				:columns="queryForm1.columns"
				@search="search"
			></vk-data-table-query>
			<!-- 表格搜索组件结束 -->
			<!-- 表格组件开始 -->
			<vk-data-table
				style="margin-top: 0;"
				ref="table1"
				:action="table1.action"
				:columns="table1.columns"
				:query-form-param="queryForm1"
				:right-btns="['detail_auto']"
				:selection="false"
				:row-no="true"
				:pagination="true"
				:page-size="5"
				:page-sizes="[5,10,20,50,100,1000]"
				:max-height="660"
				:default-sort="{ name:'account_reward.allow', type:'desc' }"
				@current-change="currentChange"
			>
			</vk-data-table>
			<!-- 表格组件结束 -->
			<!-- 页面主体内容结束 -->
		</view>
		<template v-slot:footer>
			<el-button :loading="page.loading" type="primary" size="medium" style="width: 80px;" @click="close">{{ page.submitText }}</el-button>
		</template>
	</vk-data-dialog>
</template>

<script>
var that; // 当前页面对象
var vk = uni.vk; // vk实例
export default {
	props: {
		value: {
			Type: Object,
			default: function() {
				return {
					show: false,
					mode: "",
					item: "",
					options: ""
				};
			}
		}
	},
	data: function() {
		// 组件创建时,进行数据初始化
		return {
			page: {
				title: "用户列表",
				submitText: "关闭",
				top: "2vh",
				width: "1400px",
				loading: false
			},
			// 表格相关开始 -----------------------------------------------------------
			table1:{
				// 表格数据请求地址
				action:"admin/business/sys/withdrawal.getNotApplyUserList",
				// 表格字段显示规则
				columns: [
					{ key: "avatar", title: "头像", type: "avatar", imageWidth:40 },
					{ key: "nickname", title: "用户昵称", type: "html", defaultValue: "未设置", minWidth: 150, align:"left",
						formatter: function(val, row, column, index) {
							let genderArr = [
								'',
								'<text class="el-icon-male" style="color:#409EFF"></text>',
								'<text class="el-icon-female" style="color:#F56C6C"></text>'
							];
							let { nickname, gender=0, full_name="" } = row;
							let full_name_str = (full_name && full_name != nickname) ? `(${full_name})` : "";

							let str = `
							<view>${nickname || '未设置'} ${full_name_str} ${genderArr[gender]}</view>
							`;
							return str;
						}
					},
					{ key: "mobile", title: "手机号码", type: "text", width: 120, defaultValue: "未设置" },
					{ key: "account_reward.wait", title: "在途奖励", type: "money", width: 120, defaultValue: 0, sortable:true },
					{ key: "account_reward.allow", title: "可提现奖励", type: "money", width: 120, defaultValue: 0, sortable:true },
					{ key: "account_reward.success", title: "已提现奖励", type: "money", width: 120, defaultValue: 0 , sortable:true},
					{ key: "account_reward.used", title: "已使用奖励", type: "money", width: 120, defaultValue: 0, sortable:true },
					{ key: "account_reward.total", title: "累计奖励", type: "money", width: 120, defaultValue: 0, sortable:true },
				],
				// 多选框选中的值
				multipleSelection:[],
				// 当前高亮的记录
				selectItem:""
			},
			queryForm1:{
				// 查询表单数据源，可在此设置默认值
				formData:{

				},
				// 查询表单的字段规则 fieldName:指定数据库字段名,不填默认等于key
				columns:[
					{ key:"nickname", title:"昵称", type:"text", width:150, mode:"%%" },
					{ key:"comment", title:"备注", type:"text", width:150, mode:"%%" },
					{ key:"mobile", title:"手机号", type:"text", width:150, mode:"%%" },
				]
			},
		};
	},
	mounted() {
		that = this;
		that.init();
	},
	methods: {
		// 初始化
		init() {
			let { value } = that;
			that._input(value);
		},
		_input(value) {
			that.$emit("input", value);
		},
		// 监听 - 页面打开
		onOpen() {
			that = this;
			let { value = {} } = that;
			let { item } = value;
			//that.form1 = vk.pubfn.copyObject(item);
		},
		// 监听 - 页面关闭
		onClose() {},
		// 打开页面
		open() {
			let { value } = that;
			value.show = true;
			that._input(value);
		},
		// 关闭页面
		close() {
			let { value } = that;
			value.show = false;
			that._input(value);
		},
		// 搜索
		search(){
			that.$refs.table1.query();
		},
		// 刷新
		refresh(){
			that.$refs.table1.refresh();
		},
		// 监听 - 行的选中高亮事件
		currentChange(val){
			that.table1.selectItem = val;
		},
	},
	watch: {
		
	},
	// 计算属性
	computed: {

	}
};
</script>

<style lang="scss" scoped>

</style>
